<{include file="top.html" }>
</head>
<body>
<style>
	.firstRow{
		background-image:url(<{$preStaticUrl}>Wap/images/ticketBGLargePart4.png);
		background-size:100% 100%;
		background-repeat:no-repeat;
		height:21.2rem;
	}

    .secondRow{
        background-image:url(<{$preStaticUrl}>Wap/images/ticketBGLargePart2.png);
        background-size:100% 100%;
        background-repeat:no-repeat;
        padding:1rem 1rem 2rem;
    }
    .QRCode{
		margin-top:1rem;
		margin-bottom:1rem;
		width:11rem;
		display:block;
	}
    .QRCode canvas{
        width: 11rem;
    }
    td{
        vertical-align:top;
        padding-bottom:1rem;
    }
    tr > td:first-child{
        white-space:nowrap;
        padding-right:1.5rem;
        color:#999;
    }

</style>
<div class="xy-panel">
    <div class="xy-panel-top">
        <div class="xy-titlebar">
            <div class="xy-titlebar-left">
                <a class="insertBefore_left_arrow_gray " href="javascript:void(0);"></a>
            </div>
            <div class="xy-titlebar-title">卡券</div>
            <div class="xy-titlebar-right"></div>
        </div>
    </div>
    <div class="xy-panel-content" style="bottom:0;padding:4.7rem 0.5rem;">
        <div class="xy-row vDirectionRow">
        	<div class="firstRow vAlignCenterRow hAlignCenterRow">
            	<div class="hAlignCenterDiv" >
                    <div class="fontSizeXXL boldText blackFont" id="tName"><{$obj.cardTitle}></div>
                    <div class="QRCode"  id="tQRCode"></div>
                    <div class="fontSizeMM" id="tID">卡券号：<{$obj.code}></div>
                    <{if $obj.status == $CARD_STATUS_USED}>
                        <a class="xy-button" style="padding-left:4rem; padding-right:4rem" href="">已使用</a>
                    <{elseif $obj.status == $CARD_STATUS_RECEIVED}>
                        <a class="xy-button" style="padding-left:4rem; padding-right:4rem" href="<{u('consume/?id='|cat:$obj['id'])}>">立即使用</a>
                    <{/if}>
                </div>
            </div>

            <div class="secondRow">
                <div class="xy-row vDirectionRow ticketDesContainer">
                    <div class="blackFont" style="margin-bottom:1.2rem;">团购券详情</div>
                    <table>
                        <tbody>
                        <tr>
                            <td>优惠说明</td><td id="desTxt"><{$obj.desc}></td>
                        </tr>
                        <tr>
                            <td>有效日期</td><td id="availabelDate"><{'Y-m-d'|date:$obj.beginTimestamp}><font color='#999'>至</font><{'Y-m-d'|date:$obj.endTimestamp}></td>
                        </tr>
                        <tr>
                            <td>可用时段</td><td id="availabelTimeTxt"><{$obj['availableDay']}></td>
                        </tr>
                        <tr>
                            <td>电话</td><td id="phoneNumTxt"><{$obj.phone}></td>
                        </tr>
                        <tr>
                            <td>使用须知</td><td id="tipsTxt"><{$obj.notice}></td>
                        </tr>
                        </tbody>
                    </table>


                    <div class="xy-row hAlignBalanceRow" style="margin-top:0.7rem" onclick="window.location.href='<{u('storelist')}>&cardId=<{$obj.cardId}>'">
                        <span class="blackFont">适用门店</span>
                        <img class="autoWidthRowElem" style="width:0.85rem;height:1.5rem" src="<{$preStaticUrl}>Wap/images/tk_icon_right.png"/>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
<{include file="signBody.html"}>
<script src="<{$preStaticUrl}>js/jquery.qrcode.min.js?v=<{$resVersion}>"></script>
<script>
    $('#tQRCode').qrcode(
            {
                width: 140, //宽度
                height: 140, //高度
                text:'<{$obj.code}>'
            }
    );
</script>
</body>
</html>